<template>

    <el-table :data="tableData" border style="width: 100%">
        <el-table-column type="index" label="序号" width="100" />
        <el-table-column prop="auditName" label="审批人员" width="200" />
        <el-table-column prop="definName" label="审批流程名称" width="150" />
        <el-table-column prop="status" label="状态" width="150">
            <template #default="scope">
                <el-tag type="success" v-if="scope.row.status == true">已审批</el-tag>

                <el-tag type="danger" v-if="scope.row.status == false">待审批</el-tag>
            </template>
        </el-table-column>
        <el-table-column prop="remark" label="意见" width="150">
            <template #default="scope">
                <el-tag type="success" v-if="scope.row.remark == 'ok'">合格</el-tag>

                <el-tag type="danger" v-if="scope.row.remark == 'no'">不合格</el-tag>
            </template>
        </el-table-column>
        <el-table-column prop="updProp" label="审批人" width="100" />

        <el-table-column prop="updTime" label="审批时间" width="200">
            <template #default="scope">
                {{ scope.row.updTime === null ? " " : moment(scope.row.updTime).format("YYYY年MM月DD日 hh:mm:ss") }}
            </template>
        </el-table-column>

        <el-table-column fixed="right" label="操作" min-width="150">
            <template #default="scope">

                <el-button link type="primary" size="small" @click="Audit(scope.row.id, 'ok')"
                    v-if="scope.row.status == false">合格</el-button>
                <el-button link type="danger" size="small" @click="Audit(scope.row.id, 'no')"
                    v-if="scope.row.status == false">不合格</el-button>

                <el-button link type="primary" size="small" @click="testincom(scope.row.next)">查看材料</el-button> &emsp;
                
            </template>
        </el-table-column>
    </el-table>



</template>

<script lang="ts" setup>
import Maxios from '@/Http/MesHelp'
import { ref, reactive, onMounted } from 'vue'
import moment from 'moment'

import { ElMessage, ElMessageBox } from 'element-plus'
import { useRoute, useRouter } from 'vue-router'

const router = useRouter()
const route = useRoute()
const dialogTableVisible = ref(false)
const audit = reactive({
    "id": 0,
    "remark": "",
    "name": localStorage.getItem("userNickname") || '',
    "rolename": localStorage.getItem("roleName") || '',
    "deportname": localStorage.getItem("departmentName") || '',
    updProp: localStorage.getItem("userNickname") || '',
})

const testincom = (id: any) => {
    if (id.length > 6) {


        router.push({ path: "/testincoming", query: { id } })
    } else {
        router.push({ path: "/testfinish", query: { id } })
    }


}

const tableData = ref([])
const next = reactive({
    id: ""
})
const AuditShow = () => {
    next.id = String(route.query.id) || ""

    Maxios.post("/api/Audit/GetAudit", next

    ).then(res => {

        tableData.value = res.data.data
    })

}
const Audit = (id: any, style: any) => {
    audit.id = id
    audit.remark = style


    Maxios.post("/api/Audit/AuditUpdate", audit

    ).then(res => {
        if (res.data.code == 200) {
            ElMessage.success(res.data.message)
            AuditShow()
            dialogTableVisible.value = false

        } else {

            ElMessage.error(res.data.message)
        }

    })

}
const Open = () => {
    dialogTableVisible.value = true


}



onMounted(() => {
    AuditShow()
})

</script>
